<template>
	<view class="page">
		<view class="user-box">
			<view class="head-out">
				<view class="user-head">
					<view class="left-out">
						<image :src="userInfo.icon" class="head-img" mode="" @tap="changeHeadImg"></image>
					</view>
					<view class="member-box">
						<view class="" v-for="(member, ind) in members" :key="ind">
							<view :class="member.icon" :style="member.style"></view>
							<view class="">{{member.title}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				members: [{"title":"普通会员","icon":"iconfont icon-huiyuan","style": "line-height: 50px;text-align: center;color: gray;font-size: 40px;"},
					{"title":"黄金会员","icon":"iconfont icon-huiyuan-",     "style": "line-height: 50px;text-align: center;color: orange;font-size: 40px;"},
					{"title":"白金会员","icon":"iconfont icon-huiyuan3",     "style": "line-height: 50px;text-align: center;color: gray;font-size: 40px;"},
					{"title":"钻石会员","icon":"iconfont icon-huiyuan4",     "style": "line-height: 50px;text-align: center;color: gray;font-size: 40px;"},
				]
			}
		},
		onShow() {
			this.userInfo = this.getGlobalUser("globalUser");
		},
		methods: {
			
		}
	}
</script>

<style>
	@import url("member.css");
	@import url("../../../static/iconfont/iconfont.css");
</style>